const { defineConfig } = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { AntDesignVueResolver } = require('unplugin-vue-components/resolvers')
const SpeedMeasurePlugin = require("speed-measure-webpack-plugin");

const isDev = process.env.NODE_ENV == 'development'

const antdvResolverConfig = {
  importStyle: 'less',
}
module.exports = defineConfig({
  transpileDependencies: true,
  chainWebpack:(config)=>{
    config.plugin('speed-measure-webpack-plugin').use(SpeedMeasurePlugin).end();

    config.plugin('define').tap((definitions) => {
      Object.assign(definitions[0], {
        __VUE_OPTIONS_API__: 'true',
        __VUE_PROD_DEVTOOLS__: 'false',
        __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'false'
      })
      return definitions
    })

    config.plugin('speed-measure-webpack-plugin').use(SpeedMeasurePlugin).end();
  },
  configureWebpack:(config)=>{

    config.plugins.push(AutoImport.default({
      resolvers: [AntDesignVueResolver(antdvResolverConfig)]
    }))
    config.plugins.push(Components.default({
      resolvers: [AntDesignVueResolver(antdvResolverConfig)]
    }))

    // 通过文件缓存，加快二次启动速度
    config.cache={
      type:'filesystem'
    }
  },
  css:{
    loaderOptions:{
      less:{
        lessOptions: {
          javascriptEnabled: true
        } 
      }
    }
  },
  devServer:{
    host: "localhost", // 启动服务器域名
    port: "3000", // 启动服务器端口号
    open: true, // 是否自动打开浏览器
    hot: true, // 开启HMR功能（只能用于开发环境，生产环境不需要了）
  }
})
